
<!doctype html>
<html>

<head>

  <meta charset="utf-8">
  <script src="../../umd/d3plus-core.full.js"></script>
  <!-- <script src="https://d3plus.org/js/d3plus-plot.v0.7.full.js"></script> -->

</head>

<body>
  <div class="viz" id="viz1"></div>
</body>

<script>

new d3plus.BarChart()
  .data("https://datausa.io/api/data?drilldowns=Year,Gender,Age&measures=Total+Population&Geography=04000US06", resp => resp.data.map(d => {
    if (d.Gender === "Female") d["Total Population"] *= -1;
    return d;
  }))
  .config({
    axisPersist: true,
    groupBy: "Gender",
    discrete: "y",
    y: "Age",
    x: "Total Population",
    stacked: true,
    time: "Year",
  })
  .render();

</script>

</html>
